<template>
	<div class="box">
		<!-- <el-button type="primary" size="default" @click="a">123</el-button> -->

		<div class="title">产品方案</div>
		<div class="container">
			<FormItems
				ref="form"
				v-model="formData"
				:form="formList"
				:state="state"></FormItems>
		</div>
	</div>
</template>

<script>
	import FormItems from '@/views/finance/manage/formItems/index.vue';
	import FormItem from '@/views/finance/reimburs/formItem/index.vue';
	export default {
		components: { FormItems, FormItem },
		dicts: ['quota_outsourcing', 'quota_source_business'],
		props: {
			value: {
				required: false,
			},
			state: {
				required: false,
			},
			type: {
				required: false,
			},
			schemeIdList: {
				required: false,
			},
		},
		inject: ['_dicts', 'details_config', '_from'],
		data() {
			return {};
		},
		computed: {
			formData: {
				get() {
					// return this.value;
					return this.useVModel.call(this);
				},
				set(val) {
					this.$emit('input', val);
				},
			},
			dicts() {
				return this._dicts();
			},
			config() {
				return this.details_config();
			},
			carTypeList() {
				let arr = [
					{
						label: '新车',
						value: '1',
					},
					{
						label: '旧车',
						value: '2',
					},
				];
				if (this.notEmpty(this.config.vehicleSource)) {
					let planCarType = '';
					switch (this.config.vehicleSource?.toString()) {
						case '1':
							planCarType = '1';
							break;
						case '2':
							planCarType = '2';
							break;
						case '3':
							planCarType = '2';
							break;
						default:
							break;
					}
					arr.forEach(item => {
						if (item.value !== planCarType) {
							item.disabled = true;
						}
					});
				}
				return arr;
			},
			carSourceTypeList() {
				let arr = [
					{
						label: '自购',
						value: '1',
					},
					{
						label: '现有',
						value: '2',
					},
					{
						label: '外部转租赁',
						value: '3',
					},
				];
				if (this.formData.carType == '1') {
					arr.splice(1, 1);
				}
				if (this.notEmpty(this.config.vehicleSource)) {
					let planCarSourceType = '';
					switch (this.config.vehicleSource?.toString()) {
						case '1':
							planCarSourceType = '1';
							break;
						case '2':
							planCarSourceType = '2';
							break;
						case '3':
							planCarSourceType = '1';
							break;
						default:
							break;
					}
					arr.forEach((item, index) => {
						if (
							item.value !== '3' &&
							item.value !== planCarSourceType
						) {
							item.disabled = true;
						}
					});
				}
				return arr;
			},
			formList() {
				return [
					{
						label: '产品方案',
						type: 'select',
						prop: 'schemeId',
						selectList: this.dicts?.schemeIdList ?? [],
						selectLabel: 'schemeName',
						selectValue: 'id',
						rules: [
							{
								required: true,
								message: '请选择产品方案',
								trigger: 'change',
							},
						],
						prototype: {
							loading: this.dicts?.schemeIdListState == 'ing',
						},
						event: {
							type: 'change',
							cb: row => {
								this.$emitter.emit('initDetaultData');
								if (row.schemeId) {
									this.$emit('setConfig');
								} else {
									this.formData.schemeSnapshootData = null;
								}

								// this.$forceUpdate();
							},
						},
					},

					{
						label: '车辆类型',
						type: 'radioGroup',
						radioGroupList: this.carTypeList,
						prop: 'carType',
						rules: [
							{
								required: true,
								message: '请选择车辆类型',
								trigger: 'change',
							},
						],
						event: {
							type: 'input',
							cb: row => {
								this.formData.carSourceType = '';
								this.formData.outsourcingType = '';
							},
						},
					},
					{
						label: '车辆来源',
						type: 'radioGroup',
						radioGroupList: this.carSourceTypeList,
						prop: 'carSourceType',
						rules: [
							{
								required: true,
								message: '请选择车辆来源',
								trigger: 'change',
							},
						],
						event: {
							type: 'input',
							cb: row => {
								this.formData.outsourcingType = ''; // 外采方式
								// this.formData.productList.map(item => {
								// 	item.insuranceBuyModeType = undefined;
								// 	item.insuranceBuyType = undefined;
								// 	item.insuranceCompanyKey = undefined;
								// 	item.insuranceCompanyVal = undefined;
								// 	item.insuranceStandardType = undefined;
								// });
								if (row.carSourceType !== '3') {
									this.formData.salesContract = null;
									// insuranceConfList 外部转租赁上边的保险表格
									this.formData.productList.map(item => {
										this.$delete(item, 'insuranceConfList');
									});
								} else {
									// this.$emitter.emit('initDetaultInsurance'); //清空保险费用
								}
							},
						},
					},
					{
						label: '外采方式',
						type: 'radioGroup',
						radioGroupList: this.dict.type.quota_outsourcing,
						prop: 'outsourcingType',
						show: this.formData.carSourceType == '3',
						rules: [
							{
								required: true,
								message: '请选择外采方式',
								trigger: 'change',
							},
						],
					},
					{
						label: '产品名称',
						prop: 'schemeName',
						type: 'input',
						state: this.type == 'preview' ? 'readonly' : 'disabled',
					},
					{
						label: '产品编号',
						prop: 'schemeCode',
						type: 'input',
						state: this.type == 'preview' ? 'readonly' : 'disabled',
					},
					{
						label: '用户类型',
						prop: 'sourceBusinessType',
						type: 'select',
						selectList: this.dict.type.quota_source_business ?? [],
						rules: true,
						state:
							this.type == 'preview'
								? 'readonly'
								: this.config.applicableType == '0'
								? 'write'
								: 'disabled',
						// state: this.type == 'preview' ? 'readonly' : 'disabled',
					},
					{
						label: '额度编号:',
						prop: 'calcSchemeCode',
						show: this.type == 'preview' && this._from == 'apply',
					},
				];
			},
		},
		created() {},
		mounted() {},
		methods: {
			a() {
				console.log(this.formData);
			},
			setDisabled() {},
			valid() {
				return new Promise(resolve => {
					this.$refs.form.form_validate(valid => resolve(valid));
				});
			},
		},
	};
</script>

<style lang="scss" scoped>
	.box {
		margin: 20px;
		padding: 20px;
		border-radius: 8px;
		background-color: #fff;
		.title {
			font-size: 16px;
			font-family: PingFangSC, PingFang SC;
			font-weight: 500;
			color: #333333;
			line-height: 22px;
			padding-bottom: 15px;
			border-bottom: 1px solid #e9e9e9;
			margin-bottom: 15px;
		}
	}
</style>
